<template>
  <div class="padding-sm">
    <span class="page-title">
       个人权限
    </span>
    <a-tabs default-active-key="1" :activeKey="activeKey" @change="tabsChange">
      <a-tab-pane key="1" tab="菜单权限">
        <MenuPermission></MenuPermission>
      </a-tab-pane>
      <a-tab-pane key="2" tab="按钮权限">
        <ButtonPermission></ButtonPermission>
      </a-tab-pane>
      <a-tab-pane key="3" tab="列表权限">
        <ListPermission></ListPermission>
      </a-tab-pane>
      <a-tab-pane key="4" tab="表单权限">
        <FormPermission></FormPermission>
      </a-tab-pane>
      <a-tab-pane key="5" tab="数据权限">
        <DataPermission></DataPermission>
      </a-tab-pane>
    </a-tabs>
  </div>
</template>

<script>
  import {
    MenuPermission,
    ButtonPermission,
    ListPermission,
    FormPermission,
    DataPermission
  } from "./tabs/index"
  export default {
    name: "basicSetting",
    components: {
      MenuPermission,
      ButtonPermission,
      ListPermission,
      FormPermission,
      DataPermission
    },
    data() {
      return {
        activeKey: '1',
      }
    },
    methods: {
      tabsChange(key) {
        this.activeKey = key
      }
    }
  }
</script>

<style scoped>

</style>
